.nav {
  position relative
  display flex
  flex-direction column
  justify-content space-between
  box-sizing border-box
  width 100%
  height 100%
  background var(--background-color)
  border-top-right-radius $box-border-radius

  ul.nav-list {
    margin 0
    padding 0
  }

  .nav-item {
    position relative
    box-sizing border-box
    width 100%
    height 78rem
    cursor pointer
    user-select none

    &:first-child {
      border-top-right-radius $box-border-radius
    }

    &.active {
      color var(--el-color-primary)
      font-weight bold
      background var(--el-color-primary-light-9)
    }

    .nav-content {
      display flex
      flex-direction column
      align-items center
      justify-content center

      .nav-name {
        margin-top 5rem
        font-size 12rem
        text-align center
      }
    }
  }


  .quick-actions {
    .quick-actions-box {
      z-index $z-index-1
      box-sizing border-box
      padding 6rem 10rem
      background var(--background-color)
      box-shadow 1rem 0 3rem var(--shadow-color)

      .el-switch {
        white-space nowrap
      }
    }
  }
}
